import React from 'react';
import '../styles/components.css';

const EmergencyButton = ({ onClick, isLoading }) => {
  return (
    <div className="button-container">
      <div className="button-background">
        <button 
          className={`emergency-button ${isLoading ? 'loading' : ''}`}
          onClick={onClick}
          disabled={isLoading}
        >
          <span className="button-text">
            {isLoading ? '报警中...' : '一键报警'}
          </span>
          <span className="button-icon">🚨</span>
        </button>
        <div className="button-glow"></div>
      </div>
      <div className="emergency-tip">
        紧急情况下，点击按钮将向您的紧急联系人发送求助信息和位置
      </div>
    </div>
  );
};

export default EmergencyButton;